<template>
  <div>
    <Tabbar>
      <Tabitem path="/home" activeColor="red">
        <img slot="tab-img" src="@/assets/img/tabbar/index.png" alt="" />
        <img
          slot="tab-img-active"
          src="@/assets/img/tabbar/index-s.png"
          alt=""
        />
        <div slot="tab-text">首页</div></Tabitem
      >
      <Tabitem path="/about" activeColor="red">
        <img slot="tab-img" src="@/assets/img/tabbar/cate.png" alt="" />
        <img
          slot="tab-img-active"
          src="@/assets/img/tabbar/cate-s.png"
          alt=""
        />
        <div slot="tab-text">分类</div></Tabitem
      >
      <Tabitem path="/cart">
        <img slot="tab-img" src="@/assets/img/tabbar/cart.png" alt="" />
        <img
          slot="tab-img-active"
          src="@/assets/img/tabbar/cart-s.png"
          alt=""
        />
        <div slot="tab-text">购物车</div></Tabitem
      >
      <Tabitem path="/user">
        <img slot="tab-img" src="@/assets/img/tabbar/my.png" alt="" />
        <img slot="tab-img-active" src="@/assets/img/tabbar/my-s.png" alt="" />
        <div slot="tab-text">我的</div></Tabitem
      >
    </Tabbar>
  </div>
</template>

<script>
import Tabbar from "../common/tabbar.vue";
import Tabitem from "../common/tab-item.vue";
export default {
  components: {
    Tabbar,
    Tabitem,
  },
};
</script>

<style>
</style>